<!doctype html>
<html>
<head>
  <meta charset="UTF-8">
  <title>TEMU运营小助手V3</title>
  <style>
    body {
      width: 100%;
      padding: 15px;
      font-family: Arial, sans-serif;
    }
    .container {
      width: 80%;
      display: flex;
      flex-direction: column;
      gap: 10px;
    }
    input {
      width: 80%;
      padding: 8px;
      border: 1px solid #ccc;
      border-radius: 4px;
    }
    button {
      padding: 8px 16px;
      background-color: #4CAF50;
      color: white;
      border: none;
      border-radius: 4px;
      cursor: pointer;
    }
    button:hover {
      background-color: #45a049;
    }
    #status {
      margin-top: 10px;
      color: #ff0000;
    }
    .mt-10 {
      margin-top: 10px;
    }
    .font-12 {
      font-size: 12px; 
      
    }
    .font-14 {
      font-size: 14px; 
      
    }
    .font-16{
      font-size: 16px;
      font-weight: bold;
    }
    .price-type {
    display: flex;
    gap: 20px;
  }
  
  .radio-label {
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
  }
  
  .price-section {
    background: #f9f9f9;
    padding: 10px;
    border-radius: 4px;
  }
  
  .price-range {
    display: flex;
    align-items: center;
    gap: 10px;
  }
  
  .separator {
    color: #666;
  }
  
  .error-message {
    color: #ff4444;
    font-size: 12px;
    margin-top: 5px;
    min-height: 15px;
  }
  
  input[type="number"] {
    width: 200px;
  }
  
  #activityUrl {
    width: 100%;
  }
  .color-666{
    color: #666;
  }
  .color-red{
    color: #ff0000;
  }
  /* 添加登录表单样式 */
  #loginForm {
    background: #f9f9f9;
    padding: 20px;
    border-radius: 8px;
    margin-bottom: 20px;
  }
  
  .login-input {
    margin-bottom: 15px;
  }
  
  .hidden {
    display: none !important;
  }
  </style>
</head>
<body>
  <div class="container">
    <h2>TEMU运营小助手1.342-新域名版</h2>
      <!-- 添加登录表单 -->
      <div id="loginForm">
        <div class="mt-10 font-16">账号登录</div>
        <div class="login-input mt-10">
          <input type="text" id="username" placeholder="请输入用户名">
        </div>
        <div class="login-input">
          <input type="password" id="password" placeholder="请输入密码">
        </div>
        <button id="loginBtn" class="mt-10">登录</button>
        <div id="loginStatus" class="error-message mt-10"></div>
      </div>
      <div id="mainContent" class="hidden">
    <div id="shopInfo" style="margin-bottom: 10px; padding: 10px; background: #f5f5f5; border-radius: 4px;">
      <div class="mt-10 font-16">当前登录店铺名称: <span id="mallName">-</span></div>
      <div class="mt-10 font-16">店铺ID: <span id="mallId">-</span></div>
      <div class="font-12 color-red">提醒:刷新网页可以停止所有操作</div>
     
    </div>
    <!---->
    <div class="tab-container" style="margin-top: 15px; border-bottom: 1px solid #ddd;">
      <div class="tabs" style="display: flex; gap: 5px;">
        <div class="tab active" data-tab="registration" style="padding: 8px 15px; cursor: pointer; color: #fff; background-color: #4CAF50; border-radius: 4px 4px 0 0; border: 1px solid #ddd; border-bottom: none;">活动报名</div>
      <!--<div class="tab" data-tab="products" style="padding: 8px 15px; cursor: pointer; color: #000; background-color: #eee; border-radius: 4px 4px 0 0; border: 1px solid #ddd; border-bottom: none;">商品管理</div>
        <div class="tab" data-tab="settings" style="padding: 8px 15px; cursor: pointer;color: #000;   background-color: #eee; border-radius: 4px 4px 0 0; border: 1px solid #ddd; border-bottom: none;">设置</div>-->
      </div>
    </div>

    <div id="registrationForm" style=" flex:flex; flex-direction: row; display: none;" class="tab-content" data-tab="registration">
      
       <div class="mt-10 font-16">请选择活动价格报名方式:</div>
      <div class="mt-10 price-type" style="flex: flex ; flex-direction: row; text-align: center;">
        <div><input type="radio" id="priceType1" name="priceType" value="1" checked>
        <label for="priceType1">固定价格</label>
       
        
      </div>
        <div><input type="radio" id="priceType2" name="priceType" value="2">
        <label for="priceType2">价格区间</label></div>
      </div>
      <!-- 固定价格输入框 -->
      <div id="fixedPriceSection" class="mt-10 price-section">
        <input type="number" id="minPrice" placeholder="注意店铺是美金还是人民币" min="0" step="0.01" required>
        <div class="font-12 color-666 mt-10">说明:如果输入5,低于5的活动将不会报名,高于5的设置活动价格为5</div>
        <div class="error-message" id="fixedPriceError"></div>
      </div>  

      <!-- 价格区间输入框 -->
      <div id="randomPriceSection" class="mt-10 price-section" style="display: none;">
        <div class="price-range">
          <input type="number" id="minRandomPrice" placeholder="最低价格" min="0" step="0.01" required>
          <span class="separator">至</span>
          <input type="number" id="maxRandomPrice" placeholder="最高价格" min="0" step="0.01" required>
        </div>
        <div class="font-12 color-666 mt-10">说明:低于最低价格的将不会报名,高于最高价格的设置活动价格为最高价格,区间内的将设置为默认平台给的价格</div>
        <div class="error-message" id="randomPriceError"></div>
      </div>

      <!-- 活动报名库存设置 -->
   
      <div id="stockSection" class="mt-10 price-section">
        <input type="number" id="activityStock" placeholder="请输入活动报名库存加多少" min="1" step="1" value="" required>
        <div class="font-12 color-666 mt-10">说明:设置每个商品的活动报名库存数量在系统库存基础上要增加多少，不填使用系统默认库存</div>
        <div class="error-message" id="stockError"></div>
      </div>

      <div class="mt-10 font-16">请选择链接获取方式:</div>
      <div class="mt-10 price-type" style="flex: flex ; flex-direction: row; text-align: center;">
        <div><input type="radio" id="urlType1" name="urlType" value="1" checked>
        <label for="urlType1">单个链接</label></div>
       <!--<div><input type="radio" id="urlType2" name="urlType" value="2">
        <label for="urlType2">批量链接</label></div>-->
        <div><input type="radio" id="urlType3" name="urlType" value="3">
        <label for="urlType3">条件筛选链接</label></div>
      </div>
      
      <!-- 单个链接输入框 -->
      <div id="singleUrlSection" class="mt-10">
        <div class="mt-10 font-16">单个活动报名链接(先打开单个活动报名链接页面):</div>
        <div class="mt-10"><input type="text" id="activityUrl" placeholder="活动报名链接">
          <button id="getUrlBtn" style="width: auto; white-space: nowrap; margin-top: 5px; font-size: 12px; height: 30px;">获取当前链接</button> </div>
          <div class="mt-10"> <button id="startBtn" class="mt-10">开始单链接自动报名</button></div>  
      </div>
      
      <!-- 批量链接输入框 -->
      <div id="batchUrlSection" class="mt-10 price-section" style="display: none;">
        <textarea id="batchActivityUrls" placeholder="请输入多个活动报名链接，每行一个链接" style="width: 100%; height: 100px; padding: 8px; border: 1px solid #ccc; border-radius: 4px;"></textarea>
        <div class="font-12 color-666 mt-10">说明: 请输入多个活动报名链接，每行一个链接</div>
        <div class="error-message" id="batchUrlError"></div>
      </div>
      
      <!-- 条件筛选输入框 -->
      <div id="filterUrlSection" class="mt-10 price-section" style="display: none;">
        <div class="mt-10 font-16">筛选条件设置(先打开营销活动首页):</div>
        
        <!-- 活动类型设置 -->
        <div class="mt-10">
          <label for="activityType" class="font-14">活动类型:</label>
          <select id="activityType" style="width: 200px; padding: 8px; border: 1px solid #ccc; border-radius: 4px;">
            <option value="13">大促-限时活动</option>
            <option value="101">秒杀进阶</option>
            <option value="127">清仓进阶</option>
          </select>
          

          <div class="font-12 color-666 mt-10">说明: 默认筛选活动类型为--限时活动</div>
        </div>
        
        <!-- 报名人数比例设置 -->
        <div class="mt-10" style="flex: flex; flex-direction: column; text-align: left;">
          <div> <label class="font-14">报名数条件:</label></div>
          <div>
            <input type="checkbox" id="enrollCountFilter" checked>
            <div class="font-12 color-666 mt-10">说明: 仅筛选已报名数小于可报名数的活动</div>
           
          </div>
         
        </div>
        
        <!-- 活动持续天数设置 -->
        <div class="mt-10">
          <label for="durationDays" class="font-14">活动持续天数:</label>
          <input type="number" id="durationDays" min="1" placeholder="输入活动持续天数">
          <div class="font-12 color-666 mt-10">说明: 输入活动持续天数进行筛选，不填则不限制</div>
        </div>
        
        <!-- 活动结束时间筛选设置 -->
        <div class="mt-10">
          <label for="endTimeDays" class="font-14">距离结束时间天数还剩:</label>
          <input type="number" id="endTimeDays" min="0" placeholder="输入距离结束天数还剩多少天">
          <div class="font-12 color-666 mt-10">说明: 筛选距离活动还剩时间指定天数的活动，不填则不限制</div>
        </div>
        <div class="mt-10">
          <label class="font-14">活动开始时间筛选:</label>
          <div class="mt-10 price-type" style="flex: flex; flex-direction: row; text-align: left;">
            <div>
              <input type="radio" id="startTimeFilter1" name="startTimeFilter" value="1" checked>
              <label for="startTimeFilter1">已开始活动</label>
            </div>
            <div>
              <input type="radio" id="startTimeFilter2" name="startTimeFilter" value="2">
              <label for="startTimeFilter2">未开始活动</label>
            </div>
          </div>
          <div class="font-12 color-666 mt-10">说明: 根据活动是否已开始进行筛选</div>
        </div>
        
        <button id="fetchActivitiesBtn" class="mt-10">获取符合条件的活动</button>
        <div id="fetchStatus" class="mt-10" style="color: #666;"></div>
        
        <!-- 筛选结果列表 -->
        <div class="mt-10">
          <div class="font-16">筛选结果:</div>
          <select id="filteredActivities" size="5" style="width: 100%; margin-top: 10px; padding: 8px; border: 1px solid #ccc; border-radius: 4px;">
            <option value="" disabled selected>请先获取活动列表</option>
          </select>
          <div class="font-12 color-666 mt-10">说明: 请核对筛选结果,刷新网页可以停止报名</div>
          <div class="mt-10">
            <button id="batchEnrollBtn" class="mt-10" style="width: 100%; background-color: #ff9800;">批量轮流报名筛选后的所有活动</button>
            <div id="batchEnrollStatus" class="mt-10" style="color: #666;"></div>
          </div>
        </div>
      </div>
      
     
 
    
    </div>
    
      <!-- 商品管理选项卡内容 -->
      <div id="productsTab" class="tab-content" data-tab="products" style="display: none;">
        <div class="mt-10 font-16">活动报名记录导出</div>
       <!-- <div class="mt-10">
          <button id="exportProductsBtn" class="mt-10" style="width: 100%;">导出活动报名记录数据</button>
          <div id="exportStatus" class="mt-10" style="color: #666;"></div>
        </div>-->
        <p>此功能正在开发中，敬请期待...</p>
      </div>
      
      <!-- 设置选项卡内容 -->
      <div id="settingsTab" class="tab-content" data-tab="settings" style="display: none;">
        <div class="mt-10 font-16">系统设置</div>
        <p>此功能正在开发中，敬请期待...</p>
      </div>
</div>

      <div id="status"></div>
    <DIV id="help" style="margin-top: 10px;">
      <h3>使用说明</h3>
      <p>1. 请确保您已登录TEMU半托管店铺并核对相关信息是否有误。</p>
      <p>2. 请确保您输入准确的活动报名链接。</p>
      <p style="color:#ff0000">3. 本版目前仅支持"限时活动"的活动报名链接。</p>
      <p style="color:#ccc">4. 支持个性化定制各类temu插件。</p>
  </div>
  <script src="xlsx.full.min.js"></script>
  <script src="sidebar.js"></script>
</body>
</html>